<template>
  <div class="container page">


    <!-- <p style="margin:20rpx;">手机号</p>

    <input type="text" style="border: 1px solid #ddd;margin:20rpx;" placeholder="手机号" v-model="username">
        <p style="margin:20rpx;">密码</p>

    <input type="password" style="border: 1px solid #ddd;margin:20rpx;" placeholder="8位+" v-model="password">
    <p style="text-align:center;margin-top:100rpx;" @click="login">登录</p>

    <p style="text-align:center;margin-top:100rpx;" @click="changepassword">忘记密码</p> -->


	<!-- <div class="one">
        <ul><img src="https://www.hatchdo.com/wxmini/Register/dingzhi.png" class="tp"></ul>
    </div> -->

<!--    20210430-->
    <div style="margin:20rpx;text-align:right" @click="goSignup">
      <p>新用户注册</p>
    </div>

    <div class="back">
        <ul>&nbsp;</ul>
        <ul class="txx"><img :src="userinfo.avatarUrl" class="tx"></ul>
        <ul class="nk">{{userinfo.nickName}}</ul>
    </div>
    <div class="two">
        <ul class="zt"><p style="vertical-align:middle;">手机号</p></ul>
        <ul class="zt"  style="flex: 2;"><p style="height:60rpx;line-height:60rpx"><input type="text" class="yzm"  placeholder="请输入已注册手机号" v-model="username" /></p></ul>
        <ul class="zt"><p></p></ul>
    </div>
    <div class="two">
        <ul class="zt"><p>密码</p></ul>
        <ul class="zt"  style="flex: 2;" ><p><input type="password" class="yzm" placeholder="请输入密码" v-model="password" /></p></ul>
        <ul class="zt"><p @click="changepassword" style="background-color:#707070;color:#ffffff">忘记密码</p></ul>
    </div>
    <div class="two">
        <!-- <ul class="button">
            <input type="button" value="注册" class="bk"/>
        </ul> -->
        <p style="text-align:center;background-color:#000;color:#fff;margin:0 250rpx;margin-top:150rpx;height: 60rpx;line-height: 60rpx;width:100%" @click="login">登录</p>
    </div>
<!--    <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">绑定手机号并注册</button>-->
<!--    <button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">微信手机号登录</button>-->

  </div>
</template>
<script>
// var WXBizDataCrypt = require('@/tools/WXBizDataCrypt')
// var RdWXBizDataCrypt = require('@/tools/RdWXBizDataCrypt')
import qcloud from 'wafer2-client-sdk'

import {showSuccess, showModal} from '@/util'
import {get, post} from '@/util'
// import {get2, post2} from '@/server/api'
import config from '@/config'
export default {

  data () {
    return {
      // username:"15301960020",
      // username:"17717375417",
      // password:"12345678",
      username:"",
      password:"",
      userinfo: {},
      tabA: 0,
      productList: [],
      focus: true,
      inputValue: ''
    }
  },
  mounted () {
    // this.userinfo = wx.getStorageSync('userinfo')
  },
  onShareAppMessage() {
    return {
      title: `华人耀酱香型白酒，传承古法工艺，与国酒茅台同宗同源同品。`,
      // imageUrl: 'https://www.rrjiaoyi.com/static/rr-min/share/share.png',
      // path: `/pages/me/main?sharepath=home`
    }
  },
  methods: {
    // 手机号登录
    // getPhoneNumber (e) {
    //   console.log(e.target)
    //   console.log(JSON.parse(wx.getStorageSync('session_key')))
    //
    //   wx.login({
    //     success (res) {
    //       // console.log(config.hosta)
    //
    //       if (res.code) {
    //
    //         // 登录
    //         wx.request({
    //           url: `${config.hosta}geweb/wxmini/login`,
    //           data: {
    //             code: res.code
    //           },
    //
    //           success: function (res) {
    //             console.log(res.data.res)
    //             wx.setStorageSync('session_key', res.data.res)
    //
    //             let appId = 'wxef163e57c6d4087b'
    //             let sessionKey = JSON.parse(res.data.res).session_key
    //             let encryptedData = e.target.encryptedData
    //             let iv = e.target.iv
    //
    //             let pc = new RdWXBizDataCrypt(appId, sessionKey)
    //
    //             let data = pc.decryptData(encryptedData, iv)
    //
    //             console.log('解密后 data: ', data)
    //           }
    //         })
    //
    //       } else {
    //
    //         console.log('登录失败！' + res.errMsg)
    //       }
    //
    //     }
    //   })
    //
    //   // let appId = 'wxef163e57c6d4087b'
    //   // let sessionKey = JSON.parse(wx.getStorageSync('session_key')).session_key
    //   // let encryptedData = e.target.encryptedData
    //   // let iv = e.target.iv
    //   //
    //   // let pc = new RdWXBizDataCrypt(appId, sessionKey)
    //   //
    //   // let data = pc.decryptData(encryptedData, iv)
    //
    //   // console.log('解密后 data: ', data)
    // },
    goSignup(){
        wx.navigateTo({
          url: `/pages/signup/main`
        })
    },
    changepassword(){
        wx.navigateTo({
          url: `/pages/changepassword/main`
        })
    },
    login() {
      post(`geweb/login`, {"username":this.username,"password":this.password}, {})
      .then(result => {

         wx.showToast({
            title: result.message,
            icon: 'none'
          })


         if (result.code === 200) {

          wx.setStorageSync('user', result.res)
        wx.setStorageSync('token', result.token)

           wx.showToast({
            title: '登录成功',
            icon: 'none'
          })


          setTimeout(() => {
              wx.switchTab({
                url: `/pages/usercenter/main`
              })

          }, 1000)

          }




      })
    },
    chooseTab(x) {
      this.tabA = x;
      if(x === 0) {
        this.get_product("");
      } else {
        this.get_product(x);
      }
    },
    async get_product(categoryId) {
      return await get(`geweb/product/get_productlist?categoryId=${categoryId}`, {}).then(result => {
        console.log(result.res)
        this.productList = result.res;
      })
    },
    productChoose (id) {
      // console.log(name, img, userId, accountId)
      wx.navigateTo({
        url: `/pages/product-detail/main?id=${id}`
      })
    },
    async player() {
      return await post('minipro/List', {}, {'api':'all', 'page':1})
    },
    async demo() {
    // return await get2('demo', {})
    },
    async joke() {
      return await get2('api/jokes', {})
    },
    predict () {
      wx.navigateTo({
        url: '/pages/search/main'
      })
    },
    jumpClick (comment) {
      wx.navigateTo({
        // url: '/pages/web-view/main'
        url: '/pages/web-view/main?path=' + 'https://wj.qq.com/s/2491547/f457/'
        // url: '/pages/detail/main'
      })
    }

  },
  onShow () {
    // this.get_product("")
    if(wx.getStorageSync('userinfo')) {
     this.userinfo = JSON.parse(wx.getStorageSync('userinfo').rawData)
    }

  }
}
</script>

<style scoped lang='scss'>
.container{
  font-size: 30rpx;
}
page {
  background-color: #ffffff;
  width: 100%;
  height: 100%;
}
.section {
  text-align: center;
  margin-top: 200rpx;
  padding: 0 100rpx;
  display: flex;
  height: 80rpx;
  line-height: 80rpx;
}
.recomond {
  margin: 0 25rpx;
  margin-top: 25rpx;
  height: 100rpx;
  line-height: 100rpx;
  text-align: center;
  display: flex;
  p {
    flex: 1;
  }
}
.choose {
  color: #44CFDC;
}

.productList {
  margin: 0 25rpx;
  margin-top: 50rpx;
  border: 1px solid #ddd;
  // border-radius: 4px;
  height: 200rpx;
  // line-height: 200rpx;
  display: flex;
  text-align: center;
  div {
    flex: 1;
      img{
        width: 180rpx;
        height:180rpx;
        margin: 10rpx;
        // border-radius: 50%;
    }
  }
  .des{
    width: 400rpx;
    flex: 3;
    height: 200rpx;
    margin: 10rpx 30rpx;
    p {
      text-align: left;
      line-height: 60rpx;
    }
    .price {
      display: flex;
      span {
        flex: 1;
      }
    }
  }
}

.foot {
  color: rgb(45, 161, 187);
  text-align: center;
  margin-top: 200rpx;
}

.one{
    // display: flex;
}
.two{
  display: flex;
}
.tp{
    width: 100%;
    height: 350rpx;
}
.zt{
    flex: 1;
    // background: #C8D3D1;
    margin-top: 50rpx;
    text-align: center;
	  height:60rpx;
    line-height: 60rpx;
}
.tt{
display: table-cell;
    vertical-align:middle;
}
.button{
	flex:1;
    text-align: center;
    margin-top: 100rpx;
}
.yzm{
	// border-radius:10rpx;
	height:60rpx;
	// line-height:50rpx;
  // margin: 15rpx;
  // background-color: #ffffff
  background-color: #e6e6e6;
}
.bk{
	height:60rpx;
	line-height:60rpx;
	width:160rpx;
	font-weight:bold;
}
.dl{
	height:60rpx;
	line-height:60rpx;
	width:160rpx;
	color:#ffffff;
	background:#000000;
	font-weight:bold;
}
.back{
  margin-top: 100rpx;
}
.tp{
    width: 100%;
    height: 350rpx;
}
.txx{
    text-align: center;
}
.nk{
    text-align: center;
    margin-bottom: 1rem;
}
.tx{
    width: 60px;
    height: 60px;
    text-align: center;
    /* margin-top: 1rem;  */
    border-radius: 30px;
}
</style>
